<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>判断用户名是否存在</title>
		</head>
		<body>
			<form>
				<label for="username">用户名：</label>
				<input type="text" id="username" name="username">
				<span id="tip"></span>
				<br>
				<input type="submit" value="提交">
				</form>
				<script src="jquery-3.6.4.min.js"></script>
				<script>
					$(function(){
					$('#username').on('blur',function() {
						 var username =$(this).val();
						 $.ajax({
							 type:'POST',
							 url: 'check_username.php',
							 data: {username: username},
							 dataType:'json',
							 success:function(res){
								 if (res.code === 200){
									 $('#tip').text('用户名已存在');
									 } else {
										 $('#tip').text('用户名可用');
										 }
										 },
										 error:function(){
											 alert('名称可用');
											 },
										 });
									 });
								 });
</script>
</body>
</html>